<template>
	<view class="office_shenpi_dingdanbiaoti_ok">
		<view class="beizhu">
			<view>备注信息</view>
			<view style="color: rgb(227, 215, 208);margin-top: 20rpx; margin-left: 10rpx;">
				<input placeholder="请填写备注信息" value="" />
			</view>
		</view>

		<view class="renyuan">
			<view>通知人员</view>
			<view class="renyuan_li_one">√</view>
			<view class="renyuan_li_two">√</view>
			<view class="renyuan_li_three">√</view>
			<view class="renyuan_li_four">√</view>
			<ul class="renyuan_ul">
				<li class="renyuan_li">
					<img class="renyuan_li_img" src="/static/officeImgs/officeshenpi2.png" alt="" />
					<view>赵小刚</view>
				</li>

				<li class="renyuan_li">
					<img class="renyuan_li_img" src="/static/officeImgs/officeshenpi2.png" alt="" />
					<view>周小明</view>
				</li>

				<li class="renyuan_li">
					<img class="renyuan_li_img" src="/static/officeImgs/officeshenpi2.png" alt="" />
					<view>郭小涛</view>
				</li>

				<li class="renyuan_li">
					<img class="renyuan_li_img" src="/static/officeImgs/officeshenpi2.png" alt="" />
					<view>张小伟</view>
				</li>

				<li class="renyuan_li">
					<img class="renyuan_li_img" src="/static/officeImgs/office_shenpi_dingdan_ok.png" alt="" />
					<view>更多</view>
				</li>
			</ul>
		</view>

		<view style="margin-top: 40rpx;">
			注:审批完成后，将自动通知到所选人员。
		</view>
	</view>
</template>

<script setup>

</script>

<style lang="scss">
	.office_shenpi_dingdanbiaoti_ok {
		height: 100vh;
		font-size: 28rpx;
		background-color: rgb(249, 249, 249);
		padding: 20rpx;

		.beizhu {
			padding: 20rpx;
			height: 200rpx;
			background-color: #fff;
		}

		.renyuan {
			padding: 20rpx;
			margin-top: 100rpx;
			background-color: #fff;
			position: relative;

			.renyuan_li_one {
				width: 30rpx;
				height: 30rpx;
				line-height: 30rpx;
				color: #fff;
				background-color: rgb(0, 121, 254);
				border-radius: 50%;
				text-align: center;
				position: absolute;
				left: 100rpx;
				top: 75rpx;
			}

			.renyuan_li_two {
				width: 30rpx;
				height: 30rpx;
				line-height: 30rpx;
				color: #fff;
				background-color: rgb(0, 121, 254);
				border-radius: 50%;
				text-align: center;
				position: absolute;
				left: 235rpx;
				top: 75rpx;
			}

			.renyuan_li_three {
				width: 30rpx;
				height: 30rpx;
				line-height: 30rpx;
				color: #fff;
				background-color: rgb(0, 121, 254);
				border-radius: 50%;
				text-align: center;
				position: absolute;
				left: 370rpx;
				top: 75rpx;
			}

			.renyuan_li_four {
				width: 30rpx;
				height: 30rpx;
				line-height: 30rpx;
				color: #fff;
				background-color: rgb(0, 121, 254);
				border-radius: 50%;
				text-align: center;
				position: absolute;
				left: 510rpx;
				top: 75rpx;
			}

			.renyuan_ul {
				margin-top: 20rpx;
				display: flex;
				justify-content: space-around;

				.renyuan_li {
					text-align: center;

					.renyuan_li_img {
						width: 70rpx;
						height: 70rpx;
					}
				}
			}
		}
	}
</style>